import React from 'react';
function ShoppingItem(props){
  return(
    <div>
      <div>{props.title}</div>
      <div>{props.introduction}</div>
    </div>
  )
}
export default class ShoppingList extends React.Component {
  render(){
    // replace this piece of code with request from server
    let data = [{'title':'x_title', 'introduction':"short intro"},
      {'title':'y_title', 'introduction':"long intro"}
      ];
    const shoppinglist = data.map((item) => 
      <ShoppingItem 
            title = {item.title}
            introduction = {item.introduction}
      />
    );
    return (<div> todolist
      {shoppinglist}
    </div>
    );
  }
}
